import 'package:flutter/material.dart';
import 'package:charts_flutter/flutter.dart' as charts;
import 'package:flutter_screenutil/flutter_screenutil.dart';

class CurveChart extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => MyState();
}

class MyState extends State<CurveChart> {
  // final data = [
  //   new LinearSales(0, 10),
  //   new LinearSales(1, 3),
  //   new LinearSales(2, 15),
  //   new LinearSales(3, 10),
  //   new LinearSales(4, 20),
  //   new LinearSales(5, 15),
    
  // ];

  final data = [
    new LinearSales(0, 5),
    new LinearSales(1, 25),
    new LinearSales(2, 100),
    new LinearSales(3, 75),
    new LinearSales(4, 55),
    new LinearSales(5, 66),
    new LinearSales(6, 110),
    new LinearSales(7, 70),
    new LinearSales(8, 20),
    new LinearSales(9, 25),
    new LinearSales(10, 45),
  ];

  @override
  Widget build(BuildContext context) {
    ScreenUtil.init(context, width: 750, height: 1334, allowFontScaling: false);

    List<charts.Series<LinearSales, int>> seriesList =  [
      new charts.Series<LinearSales, int>(
        id: 'Sales',
        domainFn: (LinearSales sales, _) => sales.year,
        measureFn: (LinearSales sales, _) => sales.sales,
        data: data,
        colorFn: (_, __) => charts.Color.fromHex(code: '#297CFF'),
        // areaColorFn: (_, __) => charts.Color.fromHex(code: '#297CFF'),
        areaColorFn: (_, __) => charts.Color.fromHex(code: '#E9F2FF'),
        radiusPxFn: (_, __) => 3, // 小圆点大小
        labelAccessorFn: (LinearSales row, _) => '${row.year}: ${row.sales}',
      )
    ];

    var chart = new charts.LineChart(
      seriesList,
      animate: true,
      defaultRenderer: new charts.LineRendererConfig(
        includeArea: true, 
        stacked: true,
        // includePoints: true
      ),
      domainAxis: new charts.NumericAxisSpec(
        viewport: new charts.NumericExtents(3.0, 7.0)),
      // Optionally add a pan or pan and zoom behavior.
      // If pan/zoom is not added, the viewport specified remains the viewport.
      behaviors: [new charts.PanBehavior()],
    );

    return  Container(
      child: SizedBox(
        child: chart,
      )
    );
  }
}

class LinearSales {
  final int year;
  final int sales;

  LinearSales(this.year, this.sales);
}